<template>
	<view class="content pbgc">
		<view class="wallet-header flex">
			<!-- <view class="wallet-header-li">
				<text class="wallet-num">{{data.accumulate_money ? data.accumulate_money : 0}}</text>
				<view class="">消费金额(元)</view>
			</view> -->
			<view class="wallet-header-li noafter">
				<text class="wallet-num">{{data.user_money ? data.user_money : 0}}</text>
				<view class="">可提余额(元)</view>
			</view>
		</view>
		<view class="wallet-list">
			<view class="wallet-list-li flex po before" @click="open('/pages/wallet/withdraw/withdraw')">
				<view class="wallet-list-images">
					<image src="/static/member/t_02.png" class="wallet-list-image" mode=""></image>
				</view>
				<view class="wallet-list-inner">
					<text>
						提现
					</text>
				</view>
			</view>
			<!-- <view class="wallet-list-li flex po before"  @click="open('/pages/wallet/bill/bill')">
				<view class="wallet-list-images">
					<image src="/static/member/t_04.png" class="wallet-list-image" mode=""></image>
				</view>
				<view class="wallet-list-inner">
					<text>
						消费明细
					</text>
				</view>
			</view> -->
			<view class="wallet-list-li flex po before"  @click="open('/pages/wallet/withdraw-list/withdraw-list')">
				<view class="wallet-list-images">
					<image src="/static/member/t_01.png" class="wallet-list-image" mode=""></image>
				</view>
				<view class="wallet-list-inner">
					<text>
						提现记录
					</text>
				</view>
			</view>
		</view>
		<view class="wallet-list-li flex po before"   @click="open('/pages/wallet/examine/examine')">
			<view class="wallet-list-images">
				<image src="@/static/member/t_05.png" class="wallet-list-image" mode=""></image>
			</view>
			<view class="wallet-list-inner">
				<text>
					补贴查询
				</text>
			</view>
		</view>
		<!-- <view class="wallet-list mt1">
			<view class="wallet-list-li flex po before"  @click="open('/pages/wallet/sales/sales')">
				<view class="wallet-list-images">
					<image src="/static/member/t_06.png" class="wallet-list-image" mode=""></image>
				</view>
				<view class="wallet-list-inner">
					<text>
						业绩展示
					</text>
				</view>
			</view>
			<view class="wallet-list-li flex po before"  @click="open('/pages/wallet/income-order/income-order')">
				<view class="wallet-list-images">
					<image src="../../../static/member/t_03.png" class="wallet-list-image" mode=""></image>
				</view>
				<view class="wallet-list-inner">
					<text>
						我的业绩
					</text>
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
	import {
        mapState,
        mapMutations
    } from 'vuex'
	
	export default {
		computed: {
            ...mapState(['token'])
        },
		data() {
			return {
				data: {}
			}
		},
		onShow() {
			// 监听token登录状态请求会员信息
			if(this.token){
				this.getMemberInfo()				
			}
		},
		methods: {
			...mapMutations(['getNetworkType','vuexRequest']),
			open(url) {
				if(this.token){
					uni.navigateTo({
						url: url,
						fail(err) {
							console.log(err)
						}
					});
				}else{
					uni.navigateTo({
						url: '/pages/login/login/login'
					});
				}
			},
			getMemberInfo() {
				this.vuexRequest({
					url: '/api/addons/execute?route=member/info&addon=o-s-mall-dist&access-token=' + this.token,
					method: 'GET',
					data: {},
					success: (res)  => {
						//console.log(res)
						this.data = res.data.data
					},
					fail: (err)  => {
					},
				})
			}
		}
	}
</script>

<style>
	.mt1{
		margin: 20upx 0 0 0;
	}
	.before:before{
		position: absolute;
		z-index: 10;
		right: 30upx;
		top: 50%;
		margin: -8upx 0 0 0;
		content: '';
		display: block;
		width: 16upx;
		height: 16upx;
		border: solid 2upx #989898;
		transform:rotate(45deg);
		border-left: none;
		border-bottom: none;
	}
	.wallet-header{
		background: #e4475a;
		height:350upx ;
	}
	.flex{
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-pack: justify;
		-webkit-justify-content: space-between;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
	}
	.po{
		position: relative;
	}
	.po:after{
		position: absolute;
		z-index: 10;
		right: 0;
		bottom: 0;
		left: 0;
		height: 1px;
		content: '';
		-webkit-transform: scaleY(.5);
		-ms-transform: scaleY(.5);
		transform: scaleY(.5);
		background-color: #c8c7cc;
	}
	.wallet-header-li{
		text-align: center;
		width: 100%;
		color: #FFFFFF;
		position: relative;
	}
	.wallet-num{
		font-size: 60upx;
	}
	.wallet-header-li:after{
		position: absolute;
		content: '';
		background: #ff8f91;
		width: 2upx;
		height: 60upx;
		right: 0;
		bottom: 0;
		top: 50%;
		margin: -30upx 0 0 0;
	}
	.noafter:after{
		display: none;
	}
	.wallet-list-li{
		background: #FFFFFF;
		padding: 20upx 30upx;
		position: relative;
	}
	.wallet-list-image{
		width: 50upx;
		height: 50upx;
	}
	.wallet-list-inner{
		width: 100%;
		padding: 0 0 0 20upx;
		line-height: 1;
	}
	.wallet-list-images{
		line-height: 1;
	}
</style>
